<%@ page language="java" pageEncoding="utf-8" %>
<%@include file="/commons/taglibs.jsp" %>
<!DOCTYPE html>
<html>
<fmt:bundle basename="res">
<head>
    <meta charset="utf-8">
    <title><fmt:message key='lb' /></title>
    <jsp:include page="/WEB-INF/commons/commons-header.jsp" flush="true"/>
</head>
<body>

<div class="layui-fluid">
    <div class="layui-card">
        <div class="layui-form layui-card-header layuiadmin-card-header-auto">

            <div class="layui-form-item">
                <form name="totalForm" id="totalForm" method="get">

                    <div class="layui-inline">
                        <label class="layui-form-label"><fmt:message key='spmc' /></label>
                        <div class="layui-input-inline">
                            <input type="text" name="goods.name" placeholder="请输入商品名称" value="${params.goods.name}" autocomplete="off" class="layui-input">
                        </div>
                    </div>

                    <div class="layui-inline">
                        <label class="layui-form-label"><fmt:message key='dbfw' /></label>
                        <div class="layui-input-inline">
                            <select name="liveScope">
                                <option value="0"><fmt:message key='qxz' /></option>
                                <option value="1" <c:if test="${params.liveScope == 1}">selected</c:if> ><fmt:message key='qtzbj' /></option>
                                <option value="2" <c:if test="${params.liveScope == 2}">selected</c:if> ><fmt:message key='zdzbj' /></option>
                            </select>
                        </div>
                    </div>

                    <div class="layui-inline">
                        <label class="layui-form-label"><fmt:message key='jgqj' /></label>
                        <div class="layui-inline">
                            <div class="layui-input-inline" style="width: 80px">
                                <input type="text" class="layui-input" name="minPrice" value="${params.minPrice}">
                            </div>
                            <div class="layui-form-mid">-</div>
                            <div class="layui-input-inline" style="width: 80px">
                                <input type="text" class="layui-input" name="maxPrice" value="${params.maxPrice}">
                            </div>
                        </div>
                    </div>

                    <div class="layui-inline">
                        <label class="layui-form-label"><fmt:message key='lmxz' /></label>
                        <div class="layui-input-inline">
                            <select id="topChannel" lay-filter="topChannel" name="goods.goodsChannel.parent.parent.id">
                                <option value="0"><fmt:message key='qxz' /></option>
                                <c:forEach items="${channels}" var="item">
                                    <option value="${item.id}"
                                            <c:if test="${item.id eq params.goods.goodsChannel.parent.parent.id}">selected="selected"</c:if> >${item.name}</option>
                                </c:forEach>
                            </select>
                        </div>

                        <div class="layui-input-inline middleChannel">
                            <select id="middleChannel" lay-filter="middleChannel" name="goods.goodsChannel.parent.id">
                                <option value="0"><fmt:message key='qxz' /></option>
                                <c:forEach items="${params.goods.goodsChannel.parent.parent.children}" var="item">
                                    <option value="${item.id}"
                                            <c:if test="${item.id eq params.goods.goodsChannel.parent.id}">selected="selected"</c:if> >${item.name}</option>
                                </c:forEach>
                            </select>
                        </div>

                        <div class="layui-input-inline bottomChannel">
                            <select name="goods.goodsChannel.id" id="bottomChannel" lay-filter="bottomChannel">
                                <option value="0"><fmt:message key='qxz' /></option>
                                <c:forEach items="${params.goods.goodsChannel.parent.children }" var="item">
                                    <option value="${item.id}"
                                            <c:if test="${item.id eq params.goods.goodsChannel.id}">selected="selected"</c:if> >${item.name}</option>
                                </c:forEach>
                            </select>
                        </div>
                    </div>

                    <div class="layui-inline">
                        <label class="layui-form-label"><fmt:message key='yjqj' /></label>
                        <div class="layui-inline">
                            <div class="layui-input-inline" style="width: 80px">
                                <input type="text" class="layui-input" name="minScale" value="${params.minScale}">
                            </div>
                            <div class="layui-form-mid">-</div>
                            <div class="layui-input-inline" style="width: 80px">
                                <input type="text" class="layui-input" name="maxScale" value="${params.maxScale}">
                            </div>
                        </div>
                    </div>

                    <div class="layui-inline">
                        <button class="layui-btn layui-btn-sm layuiadmin-btn-list" id="search"><i class="layui-icon layui-icon-search layuiadmin-button-btn"></i> <fmt:message key='ss' /></button>
                    </div>
                </form>
            </div>
        </div>

    </div>

    <div class="layui-card">
        <div class="layui-field-box layui-form">

            <a href="javascript:void(0);" class="layui-btn layui-btn-sm layui-btn-normal" id="add"><i class="layui-icon">&#xe61f;</i><fmt:message key='xzzbcsp' /></a>
            <a href="javascript:void(0);" class="layui-btn layui-btn-sm layui-btn-danger" id="removes"><i class="layui-icon">&#x1006;</i><fmt:message key='plyc' /></a>

            <table class="layui-table" lay-size="sm">
                <thead>
                <tr>
                    <th width="5%"><input id="checkboxs" type="checkbox" lay-ignore lay-skin="primary"/></th>
                    <th><fmt:message key='xh' /></th>
                    <th width="30%"><fmt:message key='spmc' /></th>
                    <th><fmt:message key='sptp' /></th>
                    <th><fmt:message key='spfl' /></th>
                    <th><fmt:message key='spje' /></th>
                    <th><fmt:message key='yjbl' /></th>
                    <th><fmt:message key='kc' /></th>
                    <th><fmt:message key='dbfw' /></th>
                    <th><fmt:message key='zdzbj' /></th>
                    <th><fmt:message key='zt' /></th>
                    <th><fmt:message key='cz' /></th>
                </tr>
                </thead>
                <c:forEach items="${page.result}" var="item" varStatus="status">
                    <tr>
                        <td><input type="checkbox" value="${item.id}" class="feijin-check" lay-ignore lay-skin="primary"/></td>
                        <td>${status.index + 1}</td>
                        <td>${item.goods.name}</td>
                        <td><img style="max-height: 150px" class="preview" src="${store_domain}/uploads/${item.goods.defaultImage}"/></td>
                        <td>${item.goods.goodsChannel.parent.parent.name}>${item.goods.goodsChannel.parent.name}>${item.goods.goodsChannel.name}</td>
                        <td>￥${item.goods.defaultPrice}</td>
                        <td><fmt:formatNumber value="${item.guaranteeScale * 100}"/>% (<fmt:formatNumber value="${item.guaranteeScale * item.goods.defaultPrice}"/>)</td>
                        <td>${item.goods.store}</td>
                        <td>
                            <c:if test="${item.liveScope == 1}"><fmt:message key='qtzbj' /></c:if>
                            <c:if test="${item.liveScope == 2}"><fmt:message key='zdzbj' /></c:if>
                        </td>
                        <td>
                            <c:if test="${item.liveScope == 1}">-</c:if>
                            <c:if test="${item.liveScope == 2}">
                                <a href="javascript: void(0);" data-id="${item.id}" class="assign-list">${item.anchorNumber}</a>
                            </c:if>
                        </td>
                        <td>
                            <c:if test="${item.status == 1}"><fmt:message key='ysj' /></c:if>
                            <c:if test="${item.status == 2}"><fmt:message key='yxj' /></c:if>
                        </td>

                        <td>
                            <div class="layui-btn-container">
                                <a href="javascript:void(0);" data-id="${item.id}" class="layui-btn layui-btn-xs detail"><fmt:message key='ck' /></a>
                                <c:if test="${item.status == 1}">
                                    <a href="javascript:void(0);" data-id="${item.id}" class="layui-btn layui-btn-warm layui-btn-xs disable"><fmt:message key='xj' /></a>
                                </c:if>
                                <c:if test="${item.status == 2}">
                                    <a href="javascript:void(0);" data-id="${item.id}" class="layui-btn layui-btn-xs enable"><fmt:message key='shj' /></a>
                                </c:if>
                                <a href="javascript:void(0);" data-id="${item.id}" class="layui-btn layui-btn-danger layui-btn-xs remove"><fmt:message key='yc' /></a>
                            </div>
                        </td>

                    </tr>
                </c:forEach>
            </table>
            <jsp:include page="/commons/page.jsp" flush="true"/>
        </div>
    </div>

</div>

<script>

    layui.use(['form', 'layer'], function () {

        var layer = layui.layer;
        var form = layui.form;

        //全选反选
        $("#checkboxs").click(function () {
            if (this.checked) {
                $(".feijin-check:checkbox").prop("checked", true);
            } else {
                $(".feijin-check:checkbox").prop("checked", false);
            }
        });

        //加载二级商品类目
        form.on('select(topChannel)', function (data) {
            if (data.elem != data.value) {
                var id = $("#topChannel").val();
                $(".middleChannel").html("");
                $(".bottomChannel").html("");

                $.ajax({
                    url: "${web_domain}/merchant/goods/childChannels?id=" + id,
                    type: "get",
                    dataType: "JSON",
                    success: function (result) {
                        if (result.status && result.result != null) {
                            var channelsHTML = "<select lay-verify='required' id='middleChannel' class='layui-input' lay-filter='middleChannel' name='goods.goodsChannel.parent.id'>" +
                                "<option value='0'><fmt:message key='qxz' /></option>";
                            $.each(result.result, function (index, item) {
                                channelsHTML += "<option value='" + item.id + "' >" + item.name + "</option>"
                            });
                            channelsHTML += "</select>";

                            $(".middleChannel").html(channelsHTML);
                            form.render('select');//重新渲染
                        }
                    }
                });
            }
        });

        //加载三级商品类目
        form.on('select(middleChannel)', function (data) {
            if (data.elem != data.value) {
                var id = $("#middleChannel").val();
                $(".bottomChannel").html("");

                $.ajax({
                    url: "${web_domain}/merchant/goods/childChannels?id=" + id,
                    type: "get",
                    dataType: "JSON",
                    success: function (result) {
                        if (result.status && result.result != null) {
                            var channelsHTML = "<select lay-verify='required' name='goods.goodsChannel.id' id='bottomChannel' class='layui-input' lay-filter='bottomChannel'>" +
                                "<option value='0'><fmt:message key='qxz' /></option>";
                            $.each(result.result, function (index, item) {
                                channelsHTML += "<option value='" + item.id + "' >" + item.name + "</option>"
                            });
                            channelsHTML += "</select>";
                            $(".bottomChannel").html(channelsHTML);
                            form.render('select');//重新渲染
                        }
                    }
                });
            }
        });

        //添加直播商品
        $("#add").click(function () {
            layer.open({
                type: 2
                , title: '<fmt:message key='tjzbsp' />'
                , content: '${web_domain}/merchant/live/goods/create'
                , maxmin: true
                , area: ['97%', '97%']
                , btn: ['<fmt:message key='bc' />', '<fmt:message key='qx' />']
                , yes: function (index, layero) {
                    var submit = layero.find('iframe').contents().find("#submit");
                    submit.click();
                }
            });
        });

        //查看直播商品
        $(".detail").click(function () {
            var id = $(this).attr("data-id");
            layer.open({
                type: 2
                , title: '<fmt:message key='ckzbsp' />'
                , content: '${web_domain}/merchant/live/goods/detail?id=' + id
                , maxmin: true
                , area: ['97%', '97%']
                , btn: ['<fmt:message key='fh' />']
            });
        });

        //查看指定直播商
        $(".assign-list").click(function () {
            var id = $(this).attr("data-id");
            layer.open({
                type: 2
                , title: '<fmt:message key='ckzdzbj' />'
                , content: '${web_domain}/merchant/live/goods/'+ id +'/queryAssignDistributor'
                , maxmin: true
                , area: ['80%', '80%']
            });
        });


        //移除直播商品
        $(".remove").click(function () {
            var id = $(this).attr("data-id");
            layer.confirm("<fmt:message key='qrycgspm' />", function () {
                feijin.put({
                    url: "${web_domain}/merchant/live/goods/remove",
                    data: {"id": id}
                });
            });
        });

        //批量移除直播商品
        $("#removes").click(function () {
            var ids = [];
            $(".feijin-check:checkbox:checked").each(function (index, item) {
                var id = $(item).val();
                ids.push(id);
            });
            if (ids.length === 0) {
                layer.msg('<fmt:message key='qxgxxyczdjl' />');
                return false;
            }
            layer.confirm("<fmt:message key='qryjxzdzbspycm' />", function () {
                feijin.put({
                    url: "${web_domain}/merchant/live/goods/removes",
                    data: {"ids": ids.join(";")}
                });
            });
        });


        //上架直播商品
        $(".enable").click(function () {
            var id = $(this).attr("data-id");
            layer.confirm("<fmt:message key='qrsjm' />", function () {
                feijin.put({
                    url: "${web_domain}/merchant/live/goods/enable",
                    data: {"id": id}
                });
            });
        });

        //下架直播商品
        $(".disable").click(function () {
            var id = $(this).attr("data-id");
            layer.confirm("<fmt:message key='qrxjm' />", function () {
                feijin.put({
                    url: "${web_domain}/merchant/live/goods/disable",
                    data: {"id": id}
                });
            });
        });

    });

</script>
</body>
</fmt:bundle>
</html>
